<template>
    <view class="page-container">
        <view v-for="(item,index) in teachers" :key="index" class="flex border-gray border-b-solid border-b-1 pt-4 pb-4" @click="setLoginInfo(item)">
            <text>{{ item.name }}</text>
            <view class="flex-1" />
            <u-icon name="arrow-right" color="green" size="30" />
        </view>
    </view>
</template>
<script lang="ts" setup>
    import { ref, onMounted } from 'vue';
    import { http } from '@/utils/http';
    import { useUserStore } from '@/store/user';
    const teachers = ref([]);
    const userStore = useUserStore();
    onMounted(() => {
        console.log('teacher onMounted');
        http.get('/api-mini/teacher/list').then(res => {
            const response = res as ApiResponse;
            teachers.value = response.data;
        }).catch(err => {
            console.log(err);
        });
    });

    const setLoginInfo  = (teacher) => { 
        userStore.setUserInfo({
            name: teacher.name,
            role: 'teacher',
            openid: teacher.wx_id,
            avat: ''
        })
        uni.navigateTo({url: '/pages/index/index'})
        // uni.switchTab({url: '/pages/index/index'})
    }
</script>